<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="../js/css.js"></script>
    <link rel="stylesheet" href="../css/style-zj.css">
    <link rel="stylesheet" href="../css/hzy.css">
    <script src="../layer_mobile/layer.js"></script>
    <style>
        .layui-m-layerchild{
            box-shadow: none;
        }
        .layui-m-layercont{color: white;position: relative;top:75px;}
    </style>
</head>
<body class="bg_fe">
<header><a class="icon_back"></a>我的</header>
<div class="head_height"></div>
<div class="mine" v-cloak>
    <div class="top_box">
        <div class="first">
            <img class="photo" :src="info.headImg">
            <div class="text">
                <h5>{{info.username}}</h5>
                <p>{{info.mobile}}</p>
                <h6>云联盟会员卡</h6>
            </div>
        </div>
        <div class="second">
            <div class="num">NO.{{info.clubCard}}</div>
            <a :href="'my_code.html?phone='+info.mobile" @click="getCode(info.mobile)" class="icon_code"></a>
        </div>
    </div>
    <div class="order_tab">
        <div class="title">
            <span>我的订单</span>
            <a class="js-goOrder" data-id="0"><i class="fr">查看全部订单></i></a>
        </div>
        <div class="box">
            <a class="js-goOrder" data-id="1">
                <i class="icon_pay"></i><br>
                待支付
            </a>
            <a  class="js-goOrder" data-id="2">
                <i class="icon_take"></i><br>
                待拍摄
            </a>
            <a  class="js-goOrder" data-id="3">
                <i class="icon_finish"></i><br>
                已完成
            </a>
            <!--<a  class="js-goOrder" data-id="5">-->
                <!--<i class="icon_tuik"></i><br>-->
                <!--退款中-->
            <!--</a>-->
        </div>
    </div>
    <div class="list">
        <ul>
            <li><a href="progress_list.html"><i class="icon_mine06"></i>进度查询<i class="fr icon_right"></i></a></li>
            <!--<li><a href=""><i class="icon_mine07"></i>我的卡券<i class="fr icon_right"></i></a></li>-->
            <li class="invit-fried"><a><i class="icon_mine11"></i>邀请好友<i class="fr icon_right"></i></a></li>
            <li><a href="suggestion.html"><i class="icon_mine08"></i>投诉建议<i class="fr icon_right"></i></a></li>

        </ul>
    </div>
</div>


</body>
<script src="../js/config.js"></script>
<script>
    var app = new Vue({
        el: '.mine',
        data: {
            imgBaseurl:imgBaseurl,
            info:'',
        },
        beforeCreate: function () {
            var that = this;
            if(token){
                getInfo();
            }
        },
        updated: function () {

        },
        methods:{
            jumpDetail:function (id) {
                location.href='product.html?productId='+id;
            },
        }
    })

    function getInfo() {
        get_ajax("user/getUserInfo", {token:token}, function (data) {
            app.info = data.user;
            if(data.user.mobile){
                sessionStorage.setItem("phone",data.user.mobile);
            }
        });
    }

//    href="order.html"
    $(document).on('click','.js-goOrder',function(){
        window.location.href='order.html?state='+$(this).attr('data-id')
    })
    $(document).on('click','.invit-fried',function(){
        layer.open({
            content: '点击发送给好友'
            ,style: 'background: url(../img/fenXian.png) no-repeat 55%;position:absolute;right:0;top:0;background-position:100% 100%;',
        });
    })

</script>
</html>